<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <title>$.htmlClean</title>
    <style type="text/css">
        html, body
        {
            background-color: #fcf9f3;
        }
        .input, .result
        {
            font-family: Monospace;
        }
        .success
        {
            color: #0c0;
        }
        .failure
        {
            color: #c00;
        }
    </style>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script type="text/javascript" src="jquery.htmlClean.js"></script>
    <script type="text/javascript">
        function encode(value) {
            return value
                .replace(/\&/g, '&amp;')
                .replace(/\</g, '&lt;')
                .replace(/\>/g, '&gt;');

        }
        function clean(input, expected, options) {
            document.write("<p class='input'>".concat(encode(input), "</p>"));
            test_isEqual($.htmlClean(input, options), expected)
        }
        function trim(input, expected, options) {
            document.write("<p class='input'>".concat(encode(input), "</p>"));
            test_isEqual($.htmlClean.trim(input, options), expected)
        }
        function trimStart(input, expected, options) {
            document.write("<p class='input'>".concat(encode(input), "</p>"));
            test_isEqual($.htmlClean.trimStart(input, options), expected)
        }
        function trimEnd(input, expected, options) {
            document.write("<p class='input'>".concat(encode(input), "</p>"));
            test_isEqual($.htmlClean.trimEnd(input, options), expected)
        }
        function test_isEqual(actual, expected) {
            document.write("<p class='result ".concat(
                actual == expected ? "success" : "failure",
                "'>actual&nbsp;&nbsp;: '", encode(actual), "'<br />expected: '", encode(expected), "'</p>"));
        }
        function note(text) {
            document.write("<p><em>".concat(encode(text), "</em></p>"));
        }
    </script>
</head>
<body>
    <p>
        <a href="http://code.google.com/p/jquery-clean/">http://code.google.com/p/jquery-clean/</a></p>
    <h2>
        Clean</h2>
    <script type="text/javascript">
        note("reported: $.htmlClean('<h1>hello</h1>', replace:[[\"h1\", \"h3\"], \"h2\"]);");
        clean(
            "<h1>hello</h1>",
            "<h2>hello</h2>",
            {
                replace: [[["h1", "h3"], "h2"]]
            });

        note("1: other tag $.htmlClean('<h1>hello</h1>', replace:[[\"x\"], \"y\"]);");
        clean(
            "<x>hello</x>",
            "<y>hello</y>",
            {
                replace: [[["x"], "y"]]
            });

        note("2: replaced does not effect children $.htmlClean('<pre><div>hello</div></pre>', replace:[[\"pre\"], \"div\"]);");
        clean(
            "<pre><div>hello</div></pre>",
            "<div><div>hello</div></div>",
            {
                replace: [[["pre"], "div"]]
            });

        note("3: replaced conforms to new tag rules, ie inline $.htmlClean('<pre><div>hello</div></pre>', replace:[[\"pre\"], \"span\"]);");
        clean(
            "<pre><div>hello</div></pre>",
            "<div>hello</div>",
            {
                replace: [[["pre"], "span"]]
            });
    </script>
</body>
</html>
